<template>
  <div>
    <def-layout type="col0-24" :page="page" @invoke="invoke">
      <div slot="search" class="form-items">
        <el-form-item>
          <el-input v-model="formSearch.keyword" placeholder="订单号" />
        </el-form-item>
        <el-form-item>
          <el-input v-model="formSearch.creator" placeholder="申请人" />
        </el-form-item>
        <el-form-item>
          <el-select v-model="formSearch.status" placeholder="请选择订单状态">
            <el-option
              v-for="item in constants.costStatus.values()"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-date-picker
            v-model="formSearch.createTime"
            type="daterange"
            align="right"
            unlink-panels
            range-separator="至"
            start-placeholder="申请时间(起)"
            end-placeholder="申请时间(到)"
            value-format="yyyy-MM-dd"
            :picker-options="$constants.pickerOptions"
          />
        </el-form-item>
      </div>
      <div slot="content" class="grid">
        <page-grid v-if="self!=null" :parent="self">
          <div slot="columns">
            <el-table-column prop="creator" align="center" label="申请人" width="150" />
            <el-table-column prop="no" align="center" label="订单号" width="150" />
            <el-table-column prop="borrowingAmount" align="center" label="借款金额/元" width="150" />
            <el-table-column prop="borrowingTime" align="center" label="借款时间" width="180" />
            <el-table-column prop="totalCost" align="center" label="合计费用/元" width="150" />
            <el-table-column prop="status" align="center" label="订单状态" width="100">
              <template slot-scope="scope">
                <column-filter v-model="scope.row.status" type="costStatus" @click="filter" />
              </template>
            </el-table-column>
            <el-table-column prop="createTime" sortable align="center" label="申请时间" width="150" />
            <el-table-column prop="updateTime" sortable align="center" label="更新时间" width="150" />
          </div>
        </page-grid>
      </div>
    </def-layout>
  </div>
</template>
<script>
import adminSupport from 'lola-admin-support-el'
export default {
  name: 'Cost',
  components: {},
  mixins: [adminSupport.mixins.index],
  data() {
    return {
      name: 'Cost',
      formSearch: { keyword: '', status: '', creator: '' },
      self: null
    }
  },
  computed: {
    currentRole: function() {
      try {
        var conf = this.$store.state.settings.wmsConf
        let tmp = 'super'
        Object.keys(conf).forEach(val => {
          if (conf[val] && conf[val].deptId === this.currentUserDeptId) {
            tmp = val
          }
        })
        return tmp
      } catch (e) {
        console.log(this.$store.state.settings.wmsConf)
        return console.log(e)
      }
    }
  },
  created() {
    this.init() // 页面自定义初始化
    if (this.currentRole === 'logistics') { // 物流部人员
      var conf = this.$store.state.settings.wmsConf
      const currenrDutyId = this.$store.getters.token.dutyId
      if (currenrDutyId === conf.logistics.dutyId[1]) { // 当前人员为驾驶员
        this.formSearch.creator = this.$store.getters.token.loginNo
        this.search()
      }
    }
  },
  methods: {
    init() {
      var that = this
      that.loadData() // 加载数据(按钮+列表) 扩展需重写该方法
      this.self = that
    },
    search() {
      const queryList = []
      if (!String.isNullOrEmpty(this.formSearch.keyword)) {
        queryList.push({
          key: 'o.no',
          value: this.formSearch.keyword,
          oper: ':',
          join: 'and'
        })
      }
      if (!String.isNullOrEmpty(this.formSearch.creator)) {
        queryList.push({
          key: 'o.creator',
          value: this.formSearch.creator,
          oper: ':',
          join: 'and'
        })
      }
      if (
        !String.isNullOrEmpty(this.formSearch.status) &&
        this.formSearch.status !== 'All'
      ) {
        queryList.push({
          key: 'o.status',
          value: this.formSearch.status,
          oper: '=',
          join: 'and'
        })
      }
      if (this.formSearch.createTime !== null && this.formSearch.createTime.length > 0) {
        queryList.push({ 'key': 'o.createTime', 'value': this.formSearch.createTime[0], 'oper': '>=', 'join': 'and' })
        queryList.push({ 'key': 'o.createTime', 'value': this.formSearch.createTime[1], 'oper': '<=', 'join': 'and' })
      }

      this.dataGrid.params.queryList = queryList
      this.refresh()
    },
    bindSearch() {
      this.formSearch = { keyword: '', originType: '', createTime: [] }
    }

  }
}
</script>
